import React from 'react';
import { connect } from 'dva';
import { createForm } from 'rc-form';
import styles from './index.less';
import {Button,Modal,WingBlank,List,InputItem,Toast} from 'antd-mobile';
import {routerRedux} from 'dva/router';
import Block from 'fs-flex'
import Header from '../../components/Header/index'
import paihaoService from '../../services/paihaoService'
import DateUtil from '../../utils/dateUtil'
const alert = Modal.alert
class IndexPage extends React.Component{
  state={
      number: "A00002",
    sValue:'1',
    hasError:false,
    phoneNumber:'',
    todoselect:'1',
    timer:null,
    verificationCodeVal:null,
      flag:false,
      msg:"暂无预约",
      data:null
  }
  onErrorClick = () => {
    if (this.state.hasError) {
      Toast.info('Please enter 11 digits');
    }
  }
  todoSelcetChange=(value)=>{
    console.log(`current select:${value}`)
    this.setState({
      todoselect: value
    });
  }

  // 取消我的预约
  async cancelPH(id){
      if(!id){
          Toast.fail('未检测到排号信息！',2)
          return
      } 
      const params = {id:id}
      const temp=await paihaoService.queueCancel(params)
      const {code,msg}=temp
      if(code==="0000"){
          Toast.info("取消成功！",2)
          // setTimeout(() => {
          //     //this.props.history.push({pathname:'/home'})
          //
          // }, 2000);
        const dataList = this.state.data;
        const remainList = dataList.filter((item) => item.id != id)
        console.log(remainList.length)
        if(remainList.length <= 0){
          this.setState({flag:true})
          this.setState({data: []})
        }else {
          this.setState({data: remainList})
        }
      }else{
          Toast.info(msg,3)
      }

  }
    async componentDidMount(){
        if(!this.props.location.state){
            return
        }
      const {code,data,msg} = {code:this.props.location.state.code,
        data:this.props.location.state.data,
        msg:this.props.location.state.msg}
        this.setState({msg:"暂无预约"})
        if(code!=="0000"){
            this.setState({msg:msg})
        }
        console.log(this.state.data)
        if(this.state.data == null){
          this.setState({flag:true})
          this.setState({msg:"暂无预约"})

        }
        this.setState({flag:true})
        this.setState({data:data})
    }
  
  render(){
      const originData = this.state.data
    return (
      <Block vf>
        <Block>
          <Header needBack='true' title='我的预约' history = {this.props.history}/>
        </Block>
        <Block f='1' vf>
          {originData && originData.length > 0?
            originData.map((item, index) => {
              return (
                <WingBlank key={item.id} style={{borderBottom:'1px solid'}}>
                  <Block hf j="a" f={1}>
                    <Block mt={60} mb={30}  fs={30}  j="a" className={styles.num_text} w={200}>{item?item.queueCode:""}</Block>
                  </Block>

                  <Block vf pt={15}>
                    <Block fs={14}>业务类型：{item?item.businessName:""}</Block>
                  </Block>

                  <Block vf pt={15}>
                    <Block fs={14}>预约时间：{item?DateUtil.dateFtt("yyyy年MM月dd日",new Date(item.date)):""}  {item.timeSlotStartStart} - {item.timeSlotStartEnd}<br/>
                    </Block>
                    <Block fs={14} pl={70}>于{item?DateUtil.dateFtt("yyyy年MM月dd日hh时mm分ss秒",new Date(item.createTime)):""} 预约</Block>
                  </Block>
                  <Block vf pt={15}>
                    <Block fs={14} className={styles.notify_text}>{item?item.notifyInfo:""}</Block>
                  </Block>
                  <Block wf mt={15}>
                    <Block f='3'></Block>
                    <Block f='4'><Button a='c' f='c' size='small' style={{marginBottom:'5px'}} type="primary" onClick={() =>
                      alert('请确认', '是否确认取消预约？', [
                        { text: '取消', onPress: () => console.log('cancel')  },
                        { text: '确认', onPress: () => this.cancelPH(item.id)  },

                      ])
                    }
                    >取消预约</Button></Block>
                    <Block f='3'></Block>
                  </Block>

                </WingBlank>
              )
            })
                  :<WingBlank>
                    <Block hf j="a" f={1}>
                        {/*<Block mt={60} mb={30}  fs={16}  j="a" className={styles.num_text} w={200}>{this.state.msg}</Block>*/}
                        <Block mt={60} mb={30}  fs={16}  j="a" className={styles.num_text} w={200}>{this.state.flag?this.state.msg:""}</Block>
                    </Block>
                  </WingBlank>
          }
        </Block>
      </Block>
    );
  }
  
}

IndexPage.propTypes = {};

export default createForm()(connect()(IndexPage));
